<template>
	<view class="add">
		<view class="navbar">
			<view class="fixed">
				<!-- 状态栏 时间 电量 信号 -->
				<view :style="{height: navbarStatusHeight + 'px'}"></view>
				<!-- #ifdef H5 || APP-PLUS || MP-ALIPAY -->
				<view class="navbar-content">
					<uni-icons
						type="back"
						@click="back"
						color="#fff"
						size="24"
						class="back_btn"
					></uni-icons>
					<view class="navBar">
						<view class="text_title">{{ store.state.wayType.name }}</view>
					</view>
				</view>
				<!-- #endif -->
				<!-- #ifndef H5 || APP-PLUS || MP-ALIPAY -->
				<!-- 胶囊按钮左侧位置 -->
				<view
					class="navbar-content"
					:style="{width: '100%', height: navBarHeight + 'px'}"
				>
					<uni-icons
						type="back"
						@click="back"
						color="#fff"
						size="26"
						class="back_btn"
					></uni-icons>
					<view class="navBar">
						<view class="text_title">{{ store.state.wayType.name }}</view>
					</view>
				</view>
				<!-- #endif -->
			</view>
			<!-- 设置占位 将微信小程序的状态栏高度预留出来 -->
			<!-- <view :style="{height:navbarStatusHeight+navBarHeight+'px' }"></view> -->
		</view>
		<view class="contact_xy">
			<uni-list
				:border="false"
				class="uni_list"
				v-if="showGoods && !(store.state.wayType.id == moduleId)"
			>
				<!-- 商品 -->
				<uni-list-item :clickable="true" :border="false" class="pro_link">
					<template v-slot:header>
						<span class="custom-title">商品</span>
						<span class="star">*</span>
					</template>
					<template v-slot:footer v-if="store.state.wayType.factoryId">
						<view class="add_pro" @click="addGoods" v-if="!goodsCode">
							<uni-icons type="plus" color="#00c0c0" size="16"></uni-icons>
							<span class="custom-title">添加</span>
							<uni-icons
								style="padding-left: 10px"
								type="right"
								size="14"
								color="#999"
							></uni-icons>
						</view>
					</template>
				</uni-list-item>
				<!-- 已添加的商品列表 -->
				<view class="por_card" v-if="store.getters.getTotalList.length > 0">
					<view
						class="goods_item"
						v-for="(item, index) in store.getters.getTotalList"
						:key="index"
					>
						<view class="goods_item_left">
							<view class="item_img">
								<image
									:src="item.image"
									v-if="item.image"
									@click="lookImg(item.image)"
									class="_img"
									mode="aspectFill"
								></image>
								<uni-icons
									color="#aac"
									size="48"
									v-else
									type="image"
								></uni-icons>
							</view>
							<view class="item_title">
								<uni-icons
									type="minus-filled"
									size="24"
									class="delete_item"
									@click="deleteGoodsDetail(item)"
									color="#FF5733"
								></uni-icons>
								<view class="item_title_text_brand">
									<span>
										{{ item.brand }}
										<span class="dot">·</span>
										{{ item.name }}
									</span>
								</view>
								<view class="item_title_text">
									型号：
									<span class="item_title_color">{{ item.model }}</span>
								</view>
								<view class="item_title_text">
									规格：
									<span class="item_title_color">{{ item.specName }}</span>
								</view>
								<view class="item_title_text" v-if="item.code">
									一物一码：
									<span class="item_title_color">{{ item.code }}</span>
								</view>
								<view
									class="item_title_text"
									style="
										display: flex;
										align-items: center;
										justify-content: flex-end;
									"
								>
									<uni-number-box
										class="number"
										@change="changeValue(item)"
										:disabled="item.typeGoods == 1"
										style="transform: scale(0.9)"
										v-model="item.qty"
										:min="1"
									/>
								</view>
							</view>
						</view>
					</view>
				</view>
			</uni-list>
			<uni-list
				class="mg_top map_top_"
				:border="false"
				v-if="store.state.wayType.id == moduleId"
			>
				<p class="title_tip_label">第一步：电视安装</p>
				<view
					class="por_card"
					style="background-color: transparent"
					v-if="store.getters.getTotalList.length > 0"
				>
					<view
						class="goods_item"
						style="border: none; margin: 0"
						v-for="(item, index) in store.getters.getTotalList"
						:key="index"
					>
						<view class="goods_item_left">
							<view class="item_img">
								<image
									:src="item.image"
									v-if="item.image"
									@click="lookImg(item.image)"
									class="_img"
									mode="aspectFill"
								></image>
								<uni-icons
									color="#aac"
									size="48"
									v-else
									type="image"
								></uni-icons>
							</view>
							<view class="item_title">
								<view class="item_title_text_brand">
									<span>
										{{ item.brand }}
										<span class="dot">·</span>
										{{ item.name }}
									</span>
								</view>
								<view class="item_title_text">
									型号：
									<span class="item_title_color">{{ item.model }}</span>
								</view>
								<view class="item_title_text">
									规格：
									<span class="item_title_color">{{ item.specName }}</span>
								</view>
								<view class="item_title_text" v-if="item.code">
									一物一码：
									<span class="item_title_color">{{ item.code }}</span>
								</view>
								<view
									class="item_title_text"
									style="
										display: flex;
										align-items: center;
										justify-content: flex-end;
									"
								>
									<uni-number-box
										class="number"
										@change="changeValue(item)"
										:disabled="item.typeGoods == 1"
										style="transform: scale(0.9)"
										v-model="item.qty"
										:min="1"
									/>
								</view>
							</view>
						</view>
					</view>
				</view>

				<uni-list-item :border="false" title="工单总价">
					<template v-slot:footer>
						<view style="font-size: 28rpx; font-weight: bold">
							￥{{ Number(orderData.collectCustomerPrice).toFixed(2) }}
						</view>
					</template>
				</uni-list-item>
				<uni-list-item
					:border="false"
					class="pic"
					v-if="orderData.collectCustomerPrice > 0"
				>
					<template v-slot:header>
						<view class="tiao_jian">
							<span class="custom-title">
								<span
									v-if="orderData.collectCustomerPrice > 0"
									style="font-weight: bold; color: #dd524d"
								>
									*
								</span>
								上传付款凭证
							</span>
							<view class="text">（限制1张）</view>
						</view>
					</template>
					<template v-slot:footer>
						<view
							class="btn_pay"
							hover-class="active_btn"
							@click="showPricepopup.open()"
						>
							去付款
						</view>
					</template>
				</uni-list-item>
				<view class="pic_img" v-if="orderData.collectCustomerPrice > 0">
					<uni-file-picker
						@select="onsuccessImg3"
						file-extname="jpg,jpeg,png"
						:auto-upload="false"
						:imageStyles="imageStyles"
						:sizeType="['original', 'compressed']"
						:sourceType="['album', 'camera']"
						file-mediatype="image"
						v-model="orderData.payImage"
						limit="1"
					/>
				</view>
				<!-- <uni-list-item :border="false" v-if="orderData.collectCustomerPrice>0">
					<template v-slot:footer>
						
					</template>
				</uni-list-item> -->
			</uni-list>
			<uni-list class="mg_top" :border="false" v-else>
				<p class="title_tip_label">第一步：测量锁体</p>
				<view class="one_info" v-if="factoryId !== fixedFactory.one_control">
					<span class="custom-title">
						测量示范图 烦请上传导向片宽度，长度测量图
					</span>
					<view
						class="one_info_img"
						v-if="orderData.moduleId !== fixedOrderModuleId.one_control_install"
					>
						<image
							src="/static/home/key_img.jpg"
							@click="lookImg('/static/home/key_img.jpg')"
							class="one_info_img_"
							mode="aspectFit"
						></image>
					</view>
				</view>
				<uni-list-item :border="false" class="pic">
					<template v-slot:header>
						<view class="tiao_jian">
							<span class="custom-title">上传图片</span>
							<view class="text">( 允许上传9张图片 )</view>
						</view>
					</template>
				</uni-list-item>
				<view class="pic_img">
					<uni-file-picker
						@select="onsuccessImg"
						file-extname="jpg,jpeg,png"
						:auto-upload="false"
						:imageStyles="imageStyles"
						@delete="ondeleteImg"
						:sizeType="['original', 'compressed']"
						:sourceType="['album', 'camera']"
						file-mediatype="image"
						v-model="fileList"
						limit="9"
					/>
				</view>
			</uni-list>

			<view class="link"></view>
			<uni-forms ref="baseForm" :model="orderData" label-width="120">
				<view class="uni_form">
					<p class="title_tip_label">第二步：填写联系信息</p>
					<uni-forms-item
						v-if="store.state.userMobileHasLogin || token"
						:rules="[{required: true, errorMessage: '请选择服务地址'}]"
						:name="['orderUser', 'province']"
						required
						label="服务地址"
						class="address_item"
						style="padding-top: 14rpx"
					>
						<view class="sel_address" @click="popupshow2">
							<view class="text_9" v-if="!store.state.userOrder.province">
								选择服务地址
							</view>
							<view v-else>
								<view class="tipadd">
									<span class="user_name">
										{{ store.state.userOrder.name }}
									</span>
									&nbsp;&nbsp;{{ store.state.userOrder.phone }}
								</view>
								<view class="tipadd">
									{{ store.state.userOrder.province }}/{{
										store.state.userOrder.city
									}}/{{ store.state.userOrder.area }}
								</view>
								<view class="address_tip">
									{{ store.state.userOrder.address }}
								</view>
							</view>
							<uni-icons
								type="right"
								style="padding-left: 10px"
								size="14"
								color="#999"
							></uni-icons>
						</view>
					</uni-forms-item>
					<view v-else class="user_info">
						<uni-forms-item
							:rules="[{required: true, errorMessage: ' '}]"
							:name="['orderUser', 'name']"
							required
							class="address_item"
							label="报修人"
						>
							<uni-easyinput
								@change="changeInput"
								v-model="orderData.orderUser.name"
								placeholderStyle="font-size:28rpx;"
								placeholder="请输入联系姓名"
							/>
						</uni-forms-item>
						<uni-forms-item
							required
							label="联系手机"
							:rules="[{required: true, errorMessage: ' '}]"
							:name="['orderUser', 'phone']"
							class="address_item"
						>
							<uni-easyinput
								@change="changeInput"
								v-model="orderData.orderUser.phone"
								type="number"
								placeholderStyle="font-size:28rpx;"
								placeholder="请输入联系手机号"
								maxlength="11"
							/>
						</uni-forms-item>
						<uni-forms-item
							required
							label="所在地区"
							:rules="[{required: true, errorMessage: ' '}]"
							:name="['orderUser', 'province']"
							class="address_item"
						>
							<AreaAddress
								:color="color_text"
								ref="addressRef"
								@change="changeInput"
								:address_obj="addressValue"
							></AreaAddress>
						</uni-forms-item>
						<uni-forms-item
							:rules="[{required: true, errorMessage: ' '}]"
							:name="['orderUser', 'address']"
							required
							label="详细地址"
							class="address_item"
						>
							<uni-easyinput
								@change="changeInput"
								v-model="orderData.orderUser.address"
								placeholderStyle="font-size:28rpx;"
								placeholder="请输入联系详细地址"
							/>
						</uni-forms-item>
					</view>
					<view
						class="link"
						v-if="
							(!(store.state.wayType.id == moduleId) ||
								orderData.workFieldVal.length > 0) &&
							orderData.moduleId !== fixedOrderModuleId.install
						"
					></view>
					<!-- 自定义字段 -->
					<view class="">
						<p
							class="title_tip_label"
							v-if="
								(!(store.state.wayType.id == moduleId) ||
									orderData.workFieldVal.length > 0) &&
								factoryId !== fixedFactory.one_control
							"
						>
							附加信息：
						</p>
						<view
							class="info_img"
							v-if="
								!(store.state.wayType.id == moduleId) &&
								orderData.moduleId !== fixedOrderModuleId.one_control_install &&
								factoryId !== fixedFactory.one_control
							"
						>
							<image
								src="/static/home/info_img_1.png"
								@click="lookImg('/static/home/info_img_1.png')"
								class="info_img_"
								mode="aspectFit"
							></image>
							<image
								class="info_img_"
								src="/static/home/info_img_2.png"
								@click="lookImg('/static/home/info_img_2.png')"
								mode="aspectFit"
							></image>
						</view>
						<template v-if="orderData.workFieldVal.length > 0">
							<view
								v-for="(item, index) in orderData.workFieldVal"
								:key="index"
							>
								<uni-forms-item
									:label="item.name"
									:required="item.required"
									:name="[
										'workFieldVal',
										index,
										item.type === 5 || item.type === 6 || item.type === 7
											? 'imgarr'
											: 'value',
									]"
									:rules="[
										{required: item.required, errorMessage: item.tip || '必填'},
									]"
								>
									<view
										class="team_type"
										:class="{team_type_: item.type == 4 || item.type == 8}"
									>
										<!-- 文本1 -->
										<uni-easyinput
											v-model="item.value"
											v-if="item.type === 1"
											placeholderStyle="font-size:28rpx;"
											:placeholder="item.tip"
										/>
										<!-- 多行文本2 -->
										<uni-easyinput
											trim="right"
											autoHeight
											v-model="item.value"
											type="textarea"
											v-if="item.type === 2"
											placeholderStyle="font-size:28rpx;"
											:placeholder="item.tip || '请输入'"
										/>
										<!-- 单选 3-->
										<uni-data-select
											v-model="item.value"
											v-if="item.type === 3 && item.contents.length > 3"
											:localdata="item.contents"
										></uni-data-select>
										<uni-data-checkbox
											v-model="item.value"
											v-else-if="item.type === 3"
											:localdata="item.contents"
										></uni-data-checkbox>
										<!-- 多选4 -->
										<uni-data-checkbox
											v-if="item.type === 4"
											multiple
											v-model="item.value"
											:localdata="item.contents"
										></uni-data-checkbox>
										<!-- 图片 5 -->
										<view class="pic_img" v-if="item.type === 5">
											<uni-file-picker
												@select="(files) => onsuccessImg2(item, files)"
												:auto-upload="false"
												@delete="(file) => ondeleteImg2(item, file)"
												:imageStyles="imageStyles"
												file-mediatype="image"
												v-model="item.imgarr"
												:limit="item.uploadQty"
											/>
										</view>
										<!-- 附件6 -->
										<view class="pic_video" v-if="item.type === 6">
											<view
												class="list_video"
												v-for="(src, imgIndex) in item.imgarr"
												:key="imgIndex"
											>
												<view class="box_video_pdf">
													<uni-icons
														type="closeempty"
														@click="delete_video(item, imgIndex)"
														class="clear_icon"
														size="14"
														color="#fff"
													></uni-icons>
													<view class="pdf_sty" @click="lookPDF(src.url)">
														PDF
													</view>
												</view>
											</view>
											<view
												class="btn_uploader"
												v-if="item.uploadQty > item.imgarr.length"
											>
												<uni-icons
													type="plusempty"
													class="icon_plus"
													size="18"
													color="#999"
												></uni-icons>
												<uni-file-picker
													file-extname="pdf"
													fileMediatype="all"
													v-model="item.imgarr"
													:auto-upload="false"
													@select="(file) => chooseFile(item, file)"
												/>
											</view>
										</view>
										<!-- 视频7 -->
										<view class="pic_video" v-if="item.type === 7">
											<view
												class="list_video"
												v-for="(src, imgIndex) in item.imgarr"
												:key="imgIndex"
											>
												<view class="box_video">
													<uni-icons
														type="closeempty"
														@click="delete_video(item, imgIndex)"
														class="clear_icon"
														size="14"
														color="#fff"
													></uni-icons>
													<video
														:src="src.url"
														:controls="false"
														:enable-progress-gesture="false"
														:show-center-play-btn="false"
														class="item_video"
													></video>
												</view>
											</view>
											<view
												class="btn_uploader"
												v-if="item.uploadQty > item.imgarr.length"
											>
												<uni-icons
													type="plusempty"
													class="icon_plus"
													size="18"
													color="#999"
												></uni-icons>
												<uni-file-picker
													fileMediatype="video"
													mode="grid"
													file-extname="mp4,mov"
													:auto-upload="false"
													@select="(file) => chooseVideoImage(item, file)"
												/>
											</view>
										</view>
										<!-- 评分8 -->
										<uni-rate
											v-if="item.type === 8"
											v-model="item.value"
											margin="10"
										/>
									</view>
								</uni-forms-item>
							</view>
						</template>
					</view>
				</view>
			</uni-forms>
		</view>
		<view class="address_btn">
			<view class="btn_addres">
				<button type="primary" class="btn" @click="onsubService">
					提交服务
				</button>
			</view>
		</view>
	</view>
	<!-- 付款码 -->
	<uni-popup ref="showPricepopup" type="center">
		<view class="pay_style">
			<view
				style="
					display: flex;
					justify-content: flex-end;
					width: 100%;
					font-weight: normal;
				"
			>
				<uni-icons
					type="close"
					color="#999"
					@click="showPricepopup.close()"
					size="24"
				></uni-icons>
			</view>
			<view class="">付款金额</view>
			<view style="color: #dd524d; margin-top: 24rpx">
				￥{{ orderData.collectCustomerPrice.toFixed(2) }}
			</view>
			<image
				mode="aspectFit"
				:show-menu-by-longpress="true"
				style="width: 480rpx; height: 480rpx"
				src="/static/home/pay.jpg"
			></image>
			<view style="color: #999; font-size: 24rpx">长按二维码保存</view>
		</view>
	</uni-popup>
	<!--选择服务地址 弹窗  str -->
	<uni-popup ref="showAddpopup" type="bottom">
		<view class="popup_main">
			<view class="lable_top">
				选择服务地址
				<uni-icons
					class="icon"
					color="#aaa"
					@click="showAddpopup.close()"
					size="22"
					type="closeempty"
				></uni-icons>
			</view>
			<radio-group class="sele_ul">
				<view
					class="sele_li"
					v-for="(item, index) in store.state.addressList"
					:key="index"
				>
					<view class="sele_li_item" @click="itemUser(item)">
						<radio
							:value="item.id"
							@click="itemUser(item)"
							color="#007cff"
							style="transform: scale(0.8)"
							:checked="chackUseritem?.id == item.id"
						/>
						<view class="add_ed">
							<view class="user_xx">
								<span class="user_name">{{ item.username }}</span>
								&nbsp; &nbsp;{{ item.phone }}
								<view class="tip" v-if="item.mainContact">默认</view>
							</view>
							<view>{{ item.province }}/{{ item.city }}/{{ item.area }}</view>
							<view class="text">
								{{ item.address }}
							</view>
						</view>
					</view>
					<uni-icons
						size="24"
						color="#666"
						type="compose"
						@click="editItem(item)"
					></uni-icons>
				</view>
			</radio-group>
			<view class="add_btn">
				<button class="btn" @click="onaddAddress">添加地址</button>
			</view>
		</view>
	</uni-popup>
	<!--选择上门时间 弹窗  str -->
	<TimePopup
		@set-popup="showpopup = $event"
		@value-change="valueChange"
		:showpopup="showpopup"
	></TimePopup>
</template>

<script setup lang="ts">
	import {ref, onMounted} from 'vue';
	import {onLoad, onUnload} from '@dcloudio/uni-app';
	import store from '@/store/index.js';
	import apiOrder from '@/util/api/order';
	import apiUpload from '@/util/api/upload.js';
	import TimePopup from '@/components/u-user/TimePopup.vue';
	import AreaAddress from '@/components/u-user/AreaAddress.vue';
	import roleStore from '@/store/role-play.js';
	import _ from 'lodash';
	import jsonItem from './goods_file.json';
	import defaultGoodsJson from './default_goods.json';
	import afterSaleOrderConfig from '@/config/afterSaleOrder';
	import {
		module as fixedOrderModuleId,
		fixedFactory,
		createOrderCustomField as createOrderFixedCustomField,
	} from '@/config/order';
	import {useFixedFactory} from '@/hooks/useFixedData';

	const {factoryId, setFixedFactoryId} = useFixedFactory();

	const fileList = ref([]); //上传的图片
	const showAddpopup = ref(null); //选择服务地址弹窗
	const showpopup = ref(false); //选择上门时间 弹窗
	const chackUseritem = ref(); //选择的用户地址Id
	const goodsCode = ref(''); //商品编码
	const isHistory = ref(false); //历史建单
	const orderData = ref({
		collectCustomerPrice: 0,
		collectCustomerPriceVoucher: '',
		payImage: [], //凭证图片
		payGoods: 0,
		content: '', //故障描述
		expectedDate: '', //期望上门日期 xxxx-xx-xx
		expectedEndTime: '', //期望开始上门时间
		expectedStartTime: '', //期望开始上门时间
		factoryId: '',
		historyOrder: false, //是否历史工单报单：false-否，true-是
		images: [],
		moduleId: store.state.wayType.id, //工单模块ID
		orderGoodsTypes: [
			// {
			// 	"orderGoodsVos": [
			// 		{
			// 			"buyTime": "",//购买时间
			// 			"codeIds": [],//防伪编码ID
			// 			"endTime": "",//到期时间
			// 			"goodsId": 0,//商品ID
			// 			"goodsSpecId": 0,//商品规格表ID
			// 			"id": 0,//工单商品ID，新增不必传，修改必传
			// 			"qty": 1,//	商品品数量,示
			// 		}
			// 	],
			// 	"type": 1//工单编码商品类型：1-联系已登记商品，2-未登记商品，3-商品信息,示例值(1)
			// }
		],
		orderUser: {
			address: '', //联系详细地址
			area: '', //地址-县/区
			city: '', //地址-市
			helpOtherCreateOrder: false, //	是否代他人建单：0-否，1-是
			name: '', //联系姓名
			otherPhone: '', //其他电话
			phone: '', //联系手机号
			province: '', //地址-省
			town: '', //地址-镇
			userId: null, //联系ID
			overinsured: false, //质保状态：false-保内，true-保外；historyOrder为true时，此字段才生效
		},
		workFieldVal: [],
	});
	const onsuccessImg3 = (files) => {
		orderData.value.payImage = [];
		files.tempFiles.filter((o) => {
			orderData.value.payImage.push(o);
		});
	};
	const showPricepopup = ref();
	const showGoods = ref(true); //商品是否显示
	onUnload(() => {
		uni.hideLoading();
	});
	const token = ref(''); //获取token值
	const addressRef = ref(); //地址组件元素
	const addressValue = ref({
		province: '', //省
		city: '', //市
		area: '', //区
		town: '', //镇
	});
	const message = ref(''); //故障描述
	const imageStyles = ref({
		height: 72, // 边框高度
		width: 72, // 边框宽度
		border: {
			// 如果为 Boolean 值，可以控制边框显示与否
			color: '#eee', // 边框颜色
			width: '1px', // 边框宽度
			style: 'solid', // 边框样式
		},
	});
	// 预览图片
	const lookImg = (url) => {
		uni.previewImage({
			urls: [url],
		});
	};
	// 联系信息变化
	const changeInput = () => {
		if (addressRef.value.address.province) {
			color_text.value = '';
		}
		orderData.value.orderUser = {
			...orderData.value.orderUser,
			...addressRef.value.address,
		};
		store.commit('setUserOrder', orderData.value.orderUser);
	};
	//
	const moduleId = ref('1836989927687004162'); //固定模块Id

	onLoad(async (e) => {
		const pageUrl = window.location.href;
		if (pageUrl.includes('moduleCode') && pageUrl.includes('factoryCode')) {
			const pageUrlArr = pageUrl.split('&');
			let moduleCode = '';
			let factoryCode = '';
			for (let i = 0; i < pageUrlArr.length; i++) {
				if (pageUrlArr[i].includes('moduleCode')) {
					moduleCode = pageUrlArr[i].split('=')[1].trim();
				}
				if (pageUrlArr[i].includes('factoryCode')) {
					factoryCode = pageUrlArr[i].split('=')[1].trim();
					setFixedFactoryId(factoryCode)
				}
			}
			if (
				moduleCode === afterSaleOrderConfig.moduleId &&
				factoryCode === afterSaleOrderConfig.factoryId
			) {
				uni.navigateTo({
					url: `/pages/home/addAfterSaleOrder?type=${e.type}&moduleCode=${e.moduleCode}&factoryCode=${e.factoryCode}`,
				});
			}
		}

		await store.dispatch('getMobileUserHasLogin');
		if (e.type) {
			store.commit('setWayType', {
				id: e.moduleCode,
				name:
					e.type == 1
						? '安装'
						: e.type == 2
						? '维修'
						: e.type == 3
						? '保养'
						: '其他',
				type: e.type, //1安装
				factoryId: e.factoryCode || '',
			});
			orderData.value.factoryId = e.factoryCode || '';
		}
		roleStore.commit('set_rolePlay', 'u-user');
		// setTimeout(async ()=>{
		//商品扫码报单
		if (e.code) {
			// 初始化数据
			goodsCode.value = e.code;
			// 工单报单-扫码报单，获取编码信息
			getgoodsDetail();
		}
		// 历史报单
		if (e.id) {
			goodsCode.value = e.id;
			isHistory.value = true;
			getHistoryList();
		} else {
			isHistory.value = false;
		}
		// *******重新渲染****
		if (store.state.appointmentTime) {
			orderData.value.expectedDate = store.state.appointmentTime?.dateVal.date;
			orderData.value.expectedStartTime =
				store.state.appointmentTime.time.split('~')[0];
			orderData.value.expectedEndTime =
				store.state.appointmentTime.time.split('~')[1];
		}
		token.value = uni.getStorageSync('dd-access-user').token;
		orderData.value.orderUser.address = store.state.userOrder.address; //联系详细地址
		orderData.value.orderUser.area = store.state.userOrder.area; //地址-县/区
		orderData.value.orderUser.city = store.state.userOrder.city; //地址-市
		orderData.value.orderUser.name = store.state.userOrder.name; //联系姓名
		orderData.value.orderUser.phone = store.state.userOrder.phone; //联系手机号
		orderData.value.orderUser.province = store.state.userOrder.province; //地址-省
		orderData.value.orderUser.town = store.state.userOrder.town; //地址-镇
		orderData.value.orderUser.userId = store.state.userOrder.userId; //联系ID
		addressValue.value = {
			province: store.state.userOrder.province, //省
			city: store.state.userOrder.city, //市
			area: store.state.userOrder.area, //区
			town: store.state.userOrder.town, //镇
		};
		orderData.value.factoryId = store.state.wayType.factoryId || '';
		// ******end*******
		orderData.value.moduleId = store.state.wayType.id;
		if (store.state.wayType.id == moduleId.value) {
			store.commit('setorderGoodsTypes', []); //清空
			// '1837001378564743169', '1837001378619269121'
			let goodsId = '1837001378564743169';
			let goodsSpecId = '1837001378619269121';
			// let goodsId = '1715240625178898434'
			// let goodsSpecId = '1715240625178898435'

			await apiOrder.getGoodsInfo(goodsId, goodsSpecId).then((res) => {
				if (res.code == 20000) {
					let goodsJson = [
						{
							type: 3, //3-商品信息,
							checkClassifyList: [
								{
									orderGoodsVos: [
										{
											buyTime: '',
											codeIds: [],
											endTime: '',
											goodsId: '1801218601173176321',
											goodsSpecId: '1801218601194147841',
											id: null,
											qty: 1,
											name: res.data.row.name,
											specName: res.data.row.specName,
											code: '',
											brandId: res.data.row.brandId,
											brand: res.data.row.brand,
											typeId: res.data.row.typeId,
											type: res.data.row.type,
											model: res.data.row.model,
											image: res.data.row.image,
											typeGoods: 3, //1-客户已登记商品，2-未登记商品，3-商品信息
										},
									],
								},
							],
						},
					];
					store.commit(
						'setorderGoodsTypes',
						JSON.parse(JSON.stringify(goodsJson)),
					); //重新赋值
				} else {
					store.commit(
						'setorderGoodsTypes',
						JSON.parse(JSON.stringify(defaultGoodsJson)),
					); //重新赋值
				}
			});

			showGoods.value = false;
		} else if (!store.state.wayType.factoryId) {
			store.commit('setorderGoodsTypes', []); //清空
			store.commit('setorderGoodsTypes', JSON.parse(JSON.stringify(jsonItem))); //重新赋值
			showGoods.value = false;
		} else {
			showGoods.value = true;
		}
		if (orderData.value.moduleId) {
			await apiOrder.getWorkModule(orderData.value.moduleId).then((res) => {
				if (res.code == 20000) {
					// 设置申请类型标题
					if (store.state.wayType.id) {
						uni.setNavigationBarTitle({
							title: res.data.row.name,
						});
					}
					if (orderData.value.moduleId == moduleId.value) {
						orderData.value.payGoods = res.data.row.collectCustomerGoodsPrice;
					}
				}
			});
		}
		if (store.state.wayType.id) await getModuleField(store.state.wayType.id); //通过模块id获取自定义字段
		// },100)

		if (orderData.value && store.getters.getTotalList[0]) {
			orderData.value.collectCustomerPrice = Number(
				(
					(orderData.value.payGoods || 0) * store.getters.getTotalList[0].qty
				).toFixed(2),
			);
		}
	});
	const navbarStatusHeight = ref(0);
	const navBarHeight = ref(0);
	const navBarWidth = ref(375);
	const back = () => {
		var pages = getCurrentPages();
		if (pages.length - 1 > 0) {
			uni.navigateBack({
				delta: 1,
			});
		} else {
			uni.reLaunch({
				url: '/pages/home/home',
			});
		}
	};
	onMounted(() => {
		const info = uni.getSystemInfoSync();
		navbarStatusHeight.value = info.statusBarHeight;
		// 根据微信小程序的右上侧的胶囊样式 设置导航栏内容的高度
		// 条件编译 以下三个不支持胶囊样式
		// #ifndef H5 || APP-PLUS || MP-ALIPAY
		const menuInfo = uni.getMenuButtonBoundingClientRect();
		// 导航栏内容的高度 = (胶囊底部的高度 - 状态栏的高度) + (胶囊顶部的高度 - 状态栏的高度)
		navBarHeight.value =
			menuInfo.bottom -
			info.statusBarHeight +
			(menuInfo.top - info.statusBarHeight);
		// 导航栏内容的宽度  除开胶囊按钮左侧的内容宽度
		navBarWidth.value = menuInfo.left;
		// #endif
	});
	// 获取自定义字段
	const getModuleField = async (id) => {
		await apiOrder.getModuleField(id).then((res) => {
			if (res.code == 20000) {
				if (res.data.rows.length > 0) {
					orderData.value.workFieldVal = res.data.rows.map((o) => {
						o.fieldId = o.id;
						o.id = null;
						o.contents = o.contents.map((i) => {
							return {
								text: i.val,
								value: i.val,
							};
						});
						if (o.type == 5 || o.type == 6 || o.type == 7) {
							o.imgarr = [];
						} else if (o.type == 4) {
							o.value = [];
						} else {
							o.value = '';
						}
						return o;
					});
					if (factoryId.value === fixedFactory.one_control) {
						orderData.value.workFieldVal = orderData.value.workFieldVal.filter(
							(item) => {
								item.required = true;
								return (
									item.moduleFieldId === createOrderFixedCustomField.string_code
								);
							},
						);
					}
				}
			}
		});
	};
	// 商品扫码报单
	const getgoodsDetail = async () => {
		uni.showLoading({
			title: '加载中...',
		});
		await apiOrder.getUserOrderCodeInfo({code: goodsCode.value}).then((res) => {
			if (res.code == 20000) {
				store.commit('setorderGoodsTypes', []);
				addMyGoods(res.data.row);
			}
		});
		uni.hideLoading();
	};
	// 历史报单
	const getHistoryList = async () => {
		uni.showLoading({
			title: '加载中...',
		});
		await apiOrder.userHistoryOrderApplySale(goodsCode.value).then((res) => {
			if (res.code == 20000) {
				orderData.value.historyOrder = true;
				orderData.value.orderUser.overinsured = res.data.row.overinsured;
				orderData.value.orderUser.userId = res.data.row.createOrderUserId;
				orderData.value.orderUser.address = res.data.row.address;
				orderData.value.orderUser.area = res.data.row.area;
				orderData.value.orderUser.city = res.data.row.city;
				orderData.value.orderUser.province = res.data.row.province;
				orderData.value.orderUser.town = res.data.row.town;
				orderData.value.orderUser.name = res.data.row.userName;
				orderData.value.orderUser.phone = res.data.row.userPhone;
				store.commit('setUserOrder', orderData.value.orderUser);
				store.commit('setorderGoodsTypes', []); //清空
				res.data.row.goodsVos.map((o) => {
					addMyGoods(o);
				});
			}
		});
		uni.hideLoading();
	};
	//  联系已登记商品
	const addMyGoods = (item) => {
		if (item?.userId) {
			orderData.value.orderUser.userId = item.userId;
			orderData.value.orderUser.address = item.address;
			orderData.value.orderUser.area = item.area;
			orderData.value.orderUser.city = item.city;
			orderData.value.orderUser.province = item.province;
			orderData.value.orderUser.town = item.town;
			orderData.value.orderUser.name = item.userName;
			orderData.value.orderUser.phone = item.userPhone;
			store.commit('setUserOrder', orderData.value.orderUser);
		}
		if (!(store.state.userMobileHasLogin || token)) {
			addressValue.value = {
				province: store.state.userOrder.province, //省
				city: store.state.userOrder.city, //市
				area: store.state.userOrder.area, //区
				town: store.state.userOrder.town, //镇
			};
		}

		let tmp = {
			buyTime: '',
			codeIds: isHistory.value
				? item.goodsCodes.map((o) => o.codeId)
				: [item.id],
			endTime: '',
			goodsId: item.goodsId,
			goodsSpecId: item.goodsSpecId,
			id: null,
			qty: 1,
			name: item.goodsName,
			specName: item.goodsSpecName,
			code: item.code,
			brandId: item.goodsBrandId,
			brand: item.goodsBrand,
			type: item.goodsType,
			model: item.goodsModel,
			image: item.goodsImage,
			typeGoods: 1, //1-联系已登记商品，2-未登记商品，3-商品信息
		};
		let orderGoodsTypes = [];
		orderGoodsTypes.push({type: 1, orderGoodsVos: [tmp]});
		store.commit('setorderGoodsTypesItem', orderGoodsTypes); //添加
	};
	// 改变数量
	const changeValue = (item) => {
		if (store.state.wayType.id == moduleId.value) {
			orderData.value.collectCustomerPrice = Number(
				(
					(orderData.value.payGoods || 0) * store.getters.getTotalList[0].qty
				).toFixed(2),
			);
		}
		let arr = store.state.orderGoodsTypes.map((o) => {
			if (o.type == item.typeGoods) {
				if (o.brandId == item.brandId) {
					o.checkClassifyList = o.checkClassifyList.map((i) => {
						if (i.classifyId == item.typeId) {
							i.orderGoodsVos = i.orderGoodsVos.map((k) => {
								if (k.goodsSpecId == item.goodsSpecId) {
									k.qty = item.qty;
								}
								return k;
							});
						}
						return i;
					});
				}
			}
			return o;
		});
		store.commit('setorderGoodsTypes', arr);
	};
	// 删除商品
	const deleteGoods = (item) => {
		store.commit('deleteGoods', item);
	};
	// 删除明细列表的商品
	const deleteGoodsDetail = (item) => {
		if (store.getters.getTotalList.length == 1) {
			uni.showToast({
				icon: 'none',
				title: '至少有一个商品',
			});
			return;
		}
		uni.showModal({
			title: '提示',
			content: '确定要删除该商品？',
			confirmText: '取消',
			cancelText: '删除',
			success: async (res) => {
				if (res.confirm) {
				} else if (res.cancel) {
					deleteGoods(item);
				}
			},
		});
	};
	// 添加地址
	const onaddAddress = () => {
		uni.navigateTo({
			url: '/pages/user/edaddress',
		});
	};
	// 编辑地址
	const editItem = (item) => {
		uni.navigateTo({
			url: '/pages/user/edaddress?item=' + JSON.stringify(item),
		});
	};

	// 时间选择弹窗
	const chackTime = () => {
		showpopup.value = true;
	};

	// 返回预约时间选中的值
	const valueChange = (e) => {
		orderData.value.expectedDate = e?.dateVal.date;
		orderData.value.expectedStartTime = e.time.split('~')[0];
		orderData.value.expectedEndTime = e.time.split('~')[1];
		store.commit('setappointmentTime', e);
	};
	// 获取故障选择的字段
	const faultTypeList = () => {
		let list = [];
		for (let i of store.state.checkedFaultList) {
			i.list.map((o) => {
				list.push({id: i.typeId, name: o});
			});
		}
		return list;
	};
	// 选择的地址
	const itemUser = (item) => {
		chackUseritem.value = item;
		orderData.value.orderUser.address = item.address;
		orderData.value.orderUser.province = item.province;
		orderData.value.orderUser.city = item.city;
		orderData.value.orderUser.area = item.area;
		orderData.value.orderUser.town = item.town;
		orderData.value.orderUser.name = item.username;
		orderData.value.orderUser.phone = item.phone;
		orderData.value.orderUser.userId = item.id;
		store.commit('setUserOrder', orderData.value.orderUser);
		showAddpopup.value.close();
	};
	// 添加商品
	const addGoods = () => {
		uni.navigateTo({
			url: '/pages/home/way/applygoods',
		});
	};
	// 地址弹窗
	const popupshow2 = async () => {
		await store.dispatch('seleAddress', 0);
		showAddpopup.value.open();
	};
	// 选择图片后触发
	const onsuccessImg = (res) => {
		res.tempFiles.filter((o) => {
			if (o.size > 512 * 1024 && o.extname == 'gif') {
				uni.showToast({
					icon: 'none',
					title: 'GIF 图片超过限制大小',
				});
			} else {
				fileList.value.push(o);
			}
		});
	};

	// 图片从列表移除时触发
	const ondeleteImg = (res) => {
		fileList.value = fileList.value.filter((o) => {
			return o.uuid != res.tempFile.uuid;
		});
	};
	// 删除故障标签
	const setFaultType = (val) => {
		let list = [];
		list = store.state.checkedFaultList.filter((o) => {
			if (o.typeId == val.id) {
				o.list = o.list.filter((i) => {
					if (i == val.name) {
						return !i;
					}
					return i;
				});
				if (o.list.length == 0) {
					return !o;
				}
			}
			return o;
		});
		store.commit('setchackFaultList', list);
	};
	// 选择故障库
	const goFault = () => {
		uni.navigateTo({
			url: `/pages/home/fault/faulttype?value=` + goodsCode.value,
		});
	};
	// 选择图片后触发
	const onsuccessImg2 = (item, files) => {
		files.tempFiles.filter((o) => {
			if (o.size > item.uploadSize * 1024 * 1024) {
				uni.showToast({
					icon: 'none',
					title: `图片超过限制大小${item.uploadSize}MB`,
				});
			} else {
				item.imgarr.push(o);
			}
		});
	};
	// 图片从列表移除时触发
	const ondeleteImg2 = (item, file) => {
		item.imgarr = item.imgarr.filter((o) => {
			return o.uuid != file.tempFile.uuid;
		});
	};
	// 上传视频
	const chooseVideoImage = (item, file) => {
		if (file.tempFiles[0].size > item.uploadSize * 1024 * 1024) {
			uni.showToast({
				icon: 'none',
				title: `视频超过限制大小${item.uploadSize}MB`,
			});
		} else {
			item.imgarr.push(file.tempFiles[0]);
		}
	};
	// 附件上传
	function chooseFile(item, files) {
		files.tempFiles.filter((o) => {
			if (o.size > item.uploadSize * 1024 * 1024) {
				uni.showToast({
					icon: 'none',
					title: `pdf超过限制大小${item.uploadSize}MB`,
				});
			} else {
				item.imgarr.push(o);
			}
		});
	}
	// 查看附件
	const lookPDF = (url) => {
		uni.openDocument({
			filePath: url,
			fileType: 'pdf',
			success: function (res) {},
			fail: function (err) {
				uni.showToast({
					icon: 'none',
					title: err,
				});
			},
		});
	};
	// 删除视频
	const delete_video = (item, index) => {
		item.imgarr.splice(index, 1);
	};
	// 提交服务工单
	const baseForm = ref();
	const color_text = ref('');
	const onsubService = _.debounce(
		async () => {
			if (!store.state.userOrder.province) {
				color_text.value = '#f29e99';
			}
			await baseForm.value
				.validate()
				.then(async (res) => {
					if (store.state.userMobileHasLogin || token.value) {
						orderData.value.orderUser.address = store.state.userOrder.address; //联系详细地址
						orderData.value.orderUser.area = store.state.userOrder.area; //地址-县/区
						orderData.value.orderUser.city = store.state.userOrder.city; //地址-市
						orderData.value.orderUser.name = store.state.userOrder.name; //联系姓名
						orderData.value.orderUser.phone = store.state.userOrder.phone; //联系手机号
						orderData.value.orderUser.province = store.state.userOrder.province; //地址-省
						orderData.value.orderUser.town = store.state.userOrder.town; //地址-镇
						orderData.value.orderUser.userId = store.state.userOrder.userId; //联系ID
					} else {
						orderData.value.orderUser = {
							...orderData.value.orderUser,
							...addressRef.value.address,
						};
						if (!/^1[^1^2]\d{9}$/.test(orderData.value.orderUser.phone)) {
							uni.showToast({
								title: '请输入正确的手机号!',
								position: 'top',
								icon: 'none',
							});
							return;
						}
					}
					if (store.getters.getTotalList.length == 0) {
						uni.showToast({
							icon: 'none',
							title: '至少保留一个商品',
						});
						return;
					}
					if (
						orderData.value.collectCustomerPrice > 0 &&
						orderData.value.payImage.length == 0 &&
						orderData.value.moduleId == moduleId.value
					) {
						uni.showToast({
							icon: 'none',
							title: '请上传付款凭证',
						});
						return;
					}
					// 处理故障库类型 故障描述
					let arr = faultTypeList();
					arr = arr.map((o) => o.name);
					arr.push(message.value);
					let str = arr.join('、');
					orderData.value.content = str;

					// 处理选择的类型商品
					let type1 = [];
					let type3 = [];
					orderData.value.orderGoodsTypes = [];
					store.getters.getTotalList.map((o) => {
						if (o.typeGoods == 1) {
							type1.push(o);
						} else if (o.typeGoods == 3) {
							type3.push(o);
						}
					});
					if (type1.length > 0) {
						orderData.value.orderGoodsTypes.push({
							orderGoodsVos: type1,
							type: 1,
						});
					}
					if (type3.length > 0) {
						orderData.value.orderGoodsTypes.push({
							orderGoodsVos: type3,
							type: 3,
						});
					}
					uni.showLoading({
						mask: true,
						title: '加载中...',
					});

					await onSave();
				})
				.catch((err) => {
					uni.showToast({
						title: '请填写完整信息！',
						icon: 'none',
					});
				});
		},
		1000,
		{leading: false},
	);
	// 保存提交工单
	const onSave = async () => {
		let dataValue = _.cloneDeep(orderData.value);
		// 上传图片获取图片
		// 处理上传图片
		dataValue.images = [];
		if (fileList.value.length > 0) {
			for (let i = 0; i < fileList.value.length; i++) {
				let tmp = fileList.value[i];
				await apiUpload.uploadOrderFile({files: tmp.file}).then((res) => {
					dataValue.images.push({id: null, image: res.data.rows[0]});
				});
			}
		}
		dataValue.collectCustomerPriceVoucher = '';
		if (orderData.value.payImage.length > 0) {
			dataValue.collectCustomerPriceVoucher = '';
			for (let i = 0; i < orderData.value.payImage.length; i++) {
				let tmp = orderData.value.payImage[i];
				await apiUpload.uploadOrderFile({files: tmp.file}).then((res) => {
					dataValue.collectCustomerPriceVoucher = res.data.rows[0];
				});
			}
		}
		if (dataValue.workFieldVal.length > 0) {
			for (let key in dataValue.workFieldVal) {
				let item = dataValue.workFieldVal[key];
				item['optValue'] = [];
				if (item.type === 4) {
					for (let i = 0; i < item.value.length; i++) {
						let tmp = item.value[i];
						item.optValue.push({id: '', optValue: tmp});
					}
				} else if (item.type === 5 || item.type === 6) {
					for (let i = 0; i < item.imgarr.length; i++) {
						let tmp = item.imgarr[i];
						await apiUpload.uploadOrderFile({files: tmp.file}).then((res) => {
							item.optValue.push({id: '', optValue: res.data.rows[0]});
						});
					}
				} else if (item.type === 7) {
					for (let i = 0; i < item.imgarr.length; i++) {
						let tmp = item.imgarr[i];
						await apiUpload.orderVideoUpload({files: tmp.file}).then((res) => {
							item.optValue.push({id: '', optValue: res.data.rows[0]});
						});
					}
				} else if (item.type == 8) {
					item.optValue = [
						{id: '', optValue: Math.floor(Number(item.value) * 2)},
					];
				} else {
					item.optValue = [{id: '', optValue: item.value}];
				}
			}

			dataValue.workFieldVal = dataValue.workFieldVal.map((o) => {
				return {
					workFieldId: o.workFieldId,
					moduleFieldId: o.moduleFieldId,
					id: '',
					name: o.name,
					optionVos: o.optValue,
					type: o.type,
				};
			});
		}

		await apiOrder.saveUserOrder(dataValue).then((res) => {
			if (res.code == 20000) {
				// 初始化数据
				store.commit('setorderGoodsTypes', []);
				store.commit('setchackFaultList', []);
				store.commit('setchackFaultItem', {id: null});
				store.commit('setWayType', {});
				store.commit('setcheckBrandItem', {id: null});
				store.commit('setcheckClassifyItem', {id: null});
				store.commit('setappointmentTime', null);
				store.commit('setUserOrder', {
					address: '', //联系详细地址
					area: '', //地址-县/区
					city: '', //地址-市
					helpOtherCreateOrder: false, //	是否代他人建单：0-否，1-是
					name: '', //联系姓名
					otherPhone: '', //其他电话
					phone: '', //联系手机号
					province: '', //地址-省
					town: '', //地址-镇
					userId: null,
				});
				addressValue.value = {
					province: '', //省
					city: '', //市
					area: '', //区
					town: '', //镇
				};
				uni.reLaunch({
					url:
						'/pages/home/success?workNo=' +
						res.data.workNo +
						'&id=' +
						res.data.id,
				});
			}
		});
		uni.hideLoading();
	};
</script>

<style lang="scss" scoped>
	.add {
		background-color: #f6f7fa;
		position: relative;
		overflow: auto;
		height: 100vh;

		&::-webkit-scrollbar {
			width: 0;
			height: 0;
			background-color: transparent;
		}

		.fixed {
			position: fixed;
			top: 0;
			left: 0;
			z-index: 99;
			width: 100%;

			.navbar-content {
				position: relative;
				display: flex;
				align-items: center;
				justify-content: center;
				width: 100%;
				height: 80rpx;
				background-color: #007cff;

				.back_btn {
					margin-left: 24rpx;
					position: relative;
					z-index: 9;
					left: 0;
					flex: 1;
					display: flex;
					justify-content: flex-start;
				}

				.navBar {
					display: flex;
					justify-content: center;
					align-items: center;
					text-align: center;
					position: absolute;
					top: 0;
					bottom: 0;
					width: 74%;
					height: 100%;
					color: #fff;

					.text_title {
						overflow: hidden;
						white-space: nowrap;
						text-overflow: ellipsis;
						font-size: 1rem !important;
					}
				}
			}
		}

		:deep(.uni-modal__bd) {
			color: #f56c6c !important;
		}

		:deep(.uni-modal__btn_primary) {
			color: #999 !important;
		}

		:deep(.uni-modal__btn_default) {
			color: #f56c6c !important;
		}

		.custom-title {
			font-size: 28rpx;
		}

		.star {
			color: #ff5733;
			margin-left: 4rpx;
		}

		.address_btn {
			position: fixed;
			bottom: 0rpx;
			right: 0;
			left: 0;
			z-index: 4;
			background-color: #fff;
			border-top: 1px solid #eee;

			.btn_addres {
				padding: 30rpx 0;

				:deep(button:after) {
					border: none !important;
				}

				.btn {
					border-radius: 50rpx;
					height: 80rpx;
					line-height: 80rpx;
					font-size: 32rpx;
					background-color: #007cff;
					margin: 0 120rpx;
				}
			}
		}

		.contact_xy {
			margin: 100rpx 20rpx 30rpx;
			width: calc(100% - 40rpx);
			// height: 100%;
			padding-bottom: 400rpx;
			box-sizing: border-box;

			.title_tip_label {
				padding: 20rpx 20rpx 0;
				color: #007cff;
				font-size: 28rpx;
			}

			.info_img {
				display: flex;
				// flex-direction: column;
				justify-content: center;
				align-items: center;
				gap: 10rpx;
				padding: 20rpx;

				.info_img_ {
					// width:50 ;
					height: 208rpx;
					border: 1px solid #eee;
					padding: 2rpx;
				}
			}

			.one_info {
				padding: 10rpx 20rpx 0;

				.one_info_img {
					padding-top: 10rpx;

					.one_info_img_ {
						height: 240rpx;
						width: 330rpx;
						border: solid 1px #eee;
						padding: 2rpx;
					}
				}
			}

			.link {
				height: 20rpx;
				background-color: #f6f7fa;
			}

			:deep(.uni-forms-item__label) {
				font-size: 28rpx;
			}

			:deep(.uni-easyinput__content-input) {
				font-size: 28rpx;
				height: 30px;
			}

			.uni_form {
				background-color: #fff;
				padding-bottom: 8rpx;

				.user_info {
					padding-top: 20rpx;
				}

				:deep(.uni-forms-item) {
					margin-bottom: 18rpx;
					// padding: 8rpx 0;
					padding: 0rpx 24rpx 8rpx;

					.uni-select {
						border: none;
						border-bottom: solid 1px #eee;
						border-radius: 0;
					}

					.team_type {
						height: 100%;
						display: flex;
						align-items: center;
						margin-left: 20rpx;
					}

					.team_type_ {
						border-bottom: solid 1px #eee;
					}

					.addressListStr_type {
						height: 100%;
						display: flex;
						align-items: center;
						justify-content: space-between;
						padding-left: 20rpx;
						border-bottom: solid 1px #eee;
						max-height: 280rpx;
						overflow: auto;

						.icon_btn {
							margin-right: 10rpx;
						}

						.tip {
							font-size: 28rpx;
							color: #999;
						}
					}

					.btn_input {
						display: flex;
						align-items: center;
						height: 35px;
						border-bottom: solid 1px #eee;

						.uniui-bottom::before {
							color: #999;
							font-size: 14px;
						}

						.icon {
							top: -20%;
						}
					}
				}

				:deep(.uni-easyinput__content-textarea) {
					height: 100%;
					line-height: normal;
					min-height: 70rpx;
					max-height: 160rpx;
					margin: 0;
					line-height: 70rpx;
				}

				.pic_img {
					:deep(.icon-add) {
						width: 26rpx;
						height: 4rpx;
						background-color: #999;
					}

					:deep(.icon-del) {
						width: 24rpx;
					}

					:deep(.icon-del-box) {
						width: 40rpx;
						height: 40rpx;
						top: 0;
						right: 0;
						background-color: rgba(0, 0, 0, 0.3);
					}

					:deep(.file-picker__box-content) {
						border-radius: 0 !important;

						.file-picker__progress {
							display: none !important;
						}
					}
				}

				.pic_video {
					display: flex;
					align-items: center;
					flex-wrap: wrap;

					.list_video {
						display: flex;
						align-items: center;
						flex-wrap: wrap;

						.box_video {
							width: 120rpx;
							height: 120rpx;
							margin-right: 20rpx;
							margin-bottom: 20rpx;
							position: relative;

							.clear_icon {
								position: absolute;
								top: 0;
								right: 0;
								z-index: 2;
								width: 40rpx;
								height: 40rpx;
								display: flex;
								align-items: center;
								justify-content: center;

								&:after {
									content: '';
									background-color: rgba(0, 0, 0, 0.3);
									position: absolute;
									top: 0;
									right: 0;
									z-index: -1;
									width: 40rpx;
									height: 40rpx;
									border-radius: 50%;
								}
							}

							.item_video {
								width: 100%;
								height: 100%;
							}
						}

						.box_video_pdf {
							width: 100rpx;
							height: 120rpx;
							margin-right: 20rpx;
							margin-bottom: 20rpx;
							position: relative;

							.pdf_sty {
								background-color: rgb(250, 81, 81);
								width: 100%;
								height: 100%;
								color: #fff;
								text-align: center;
								font-size: 22rpx;
								position: relative;
								display: flex;
								align-items: center;
								justify-content: center;

								&:before {
									content: '';
									position: absolute;
									z-index: 2;
									border: 12rpx solid #0000002b;
									right: 0rpx;
									top: 0rpx;
									border-top: 12rpx solid #fff;
									border-right: 12rpx solid #fff;
								}
							}

							.clear_icon {
								position: absolute;
								top: 0;
								right: 0;
								z-index: 4;
								width: 40rpx;
								height: 40rpx;
								display: flex;
								align-items: center;
								justify-content: center;

								&:after {
									content: '';
									background-color: rgba(0, 0, 0, 0.3);
									position: absolute;
									top: 0;
									right: 0;
									z-index: -1;
									width: 40rpx;
									height: 40rpx;
									border-radius: 50%;
								}
							}
						}
					}

					.btn_uploader {
						border: 1px solid #eeeeee;
						width: 120rpx;
						height: 120rpx;
						display: flex;
						justify-content: center;
						align-items: center;
						border-radius: 0;
						margin-right: 20rpx;
						margin-bottom: 20rpx;
						position: relative;
						overflow: hidden;

						.icon_plus {
							width: 100%;
							height: 100%;
							display: flex;
							justify-content: center;
							align-items: center;
						}
					}

					:deep(.uni-file-picker__files) {
						position: absolute;
						top: 0;
						right: 0;
						z-index: 4;
						width: 100%;
						height: 100%;
						opacity: 0;
					}
				}

				:deep(.is-input-border) {
					border: none;
					border-bottom: 1rpx solid transparent;
					border-radius: 0;

					&.is-focused {
						border-bottom: 1rpx solid #007cff99;

						.uniui-clear,
						.uniui-eye-filled {
							color: #007cff99 !important;
						}
					}
				}
			}

			:deep(.uni_list) {
				border-radius: 20rpx;

				.other_order {
					display: flex;
					align-items: center;
				}
			}

			.por_card {
				max-height: 600rpx;
				overflow: auto;
				background-color: #f6f7fa;

				.goods_item {
					display: flex;
					align-items: center;
					justify-content: space-between;
					background-color: #fff;
					margin: 0 0 24rpx;
					border-radius: 10rpx;
					border: 1rpx solid #eee;
					padding: 24rpx 14rpx;
					padding-right: 0;
					box-sizing: border-box;
					position: relative;

					&:first-child {
						margin-top: 20rpx;
					}

					.goods_item_left {
						display: flex;
						// align-items: center;
						width: 100%;

						.item_img {
							// margin: 0 20rpx;
							width: 130rpx;
							height: 130rpx;
							background-color: #fff;
							border-radius: 10rpx;
							border: 2rpx solid #eee;

							._img {
								width: 130rpx;
								height: 130rpx;
								border-radius: 10rpx;
							}
						}

						.item_title {
							font-size: 24rpx;
							margin-left: 16rpx;
							flex: 1;
							margin-right: 14rpx;

							.delete_item {
								position: absolute;
								right: 6rpx;
								top: 6rpx;
							}

							.item_title_name {
								margin: 10rpx 0 10rpx;
								font-weight: bold;
								font-size: 28rpx;
								display: -webkit-box;
								-webkit-line-clamp: 2;
								-webkit-box-orient: vertical;
								overflow: hidden;
								word-wrap: break-word;
								word-break: break-all;
							}

							.item_title_text_brand {
								font-size: 24rpx;
								display: flex;
								align-items: center;
								justify-content: space-between;
								display: -webkit-box;
								-webkit-line-clamp: 2;
								-webkit-box-orient: vertical;
								overflow: hidden;
								word-wrap: break-word;
								word-break: break-all;

								.dot {
									font-weight: bold;
									padding: 0 10rpx;
								}
							}

							.item_title_text {
								font-size: 24rpx;
								color: #999;
								margin-top: 8rpx;

								.item_title_color {
									color: #000;
								}
							}

							.item_title_code {
								font-size: 22rpx;
								color: #999;
								display: flex;
								justify-content: space-between;
								align-items: center;
								position: relative;
								margin-top: 8rpx;

								.item_title_color {
									color: #000;
								}

								.number {
									position: absolute;
									right: -10rpx;
									bottom: 0;
								}
							}
						}
					}
				}
			}

			.address_item {
				display: flex;
				align-items: center;
				justify-content: flex-end;
				flex: 1;

				.sel_address {
					margin-left: 20rpx;
					font-size: 28rpx;
					color: #000;
					width: 100%;
					flex: 1;
					display: flex;
					align-items: center;
					justify-content: flex-end;

					.text_9 {
						color: #999;
						line-height: 42rpx;
					}

					.address_tip {
						// width: 80%;
						white-space: pre-wrap;
					}

					.tipadd {
						overflow: hidden;
						text-overflow: ellipsis;
						display: flex;
						flex-wrap: wrap;
						word-wrap: break-word;
						word-break: break-all;

						.user_name {
							text-align: right;
						}
					}
				}
			}

			.add_pro {
				color: #00c0c0;
				display: flex;
				align-items: center;
				justify-content: flex-end;
				flex: 1;

				.custom-title {
					font-size: 28rpx;
				}
			}

			.map_top_ {
				:deep(.uni-list-item__container) {
					padding-top: 0;
				}
			}

			.mg_top {
				// border-radius: 20rpx;
				.btn_pay {
					border: 1px solid #007cff;
					font-size: 28rpx;
					padding: 10rpx 12rpx;
					border-radius: 4rpx;
					background-color: #007cff;
					color: #fff;
				}

				.active_btn {
					opacity: 0.8;
				}

				.sel_ku {
					font-size: 28rpx;
					color: #999;
					line-height: 42rpx;
				}

				.miao_shu {
					:deep(.uni-list-item__content) {
						flex: 1;
					}
				}

				.message {
					margin: 0 30rpx;
					border: solid 1px #eee;

					:deep(textarea) {
						font-size: 28rpx;
						width: 600rpx;
						min-height: 100rpx;
						padding: 0 14rpx;
					}

					.big_input {
						display: flex;
						font-size: 28rpx;
						flex-wrap: wrap;
						color: #007cff;
						margin: 10rpx 0rpx 0rpx;

						.input_item {
							background-color: #fff;
							border-radius: 10rpx;
							padding: 4rpx 10rpx;
							margin-bottom: 10rpx;
							transform: scale(0.9);

							.icon_close {
								margin-left: 6rpx;
							}
						}
					}
				}

				.pic {
					:deep(.uni-list-item__container) {
						padding-bottom: 3px;
					}

					.tiao_jian {
						display: flex;
						align-items: center;

						.custom-title {
							color: #3b4144;
							font-size: 28rpx;
						}

						.text {
							font-size: 24rpx;
							color: #999;
						}
					}
				}

				.pic_img {
					margin-left: 20rpx;

					:deep(.icon-add) {
						width: 26rpx;
						height: 4rpx;
						background-color: #999;
					}

					:deep(.icon-del) {
						width: 24rpx;
					}

					:deep(.icon-del-box) {
						width: 40rpx;
						height: 40rpx;
						top: 0;
						right: 0;
						background-color: rgba(0, 0, 0, 0.3);
					}

					:deep(.uni-file-picker) {
						padding-bottom: 10rpx;
					}

					:deep(.uni-file-picker__container) {
						margin: 8rpx 2rpx 8rpx;
					}

					:deep(.file-picker__box-content) {
						overflow: visible !important;
						// margin-right: 20rpx !important;
						border-radius: 0 !important;

						.file-picker__progress {
							display: none !important;
						}
					}
				}
			}
		}
	}

	.pay_style {
		background-color: #fff;
		display: flex;
		flex-direction: column;
		align-items: center;
		padding: 24rpx;
		font-size: 28rpx;
		font-weight: bold;
	}

	.popup_main {
		background-color: #f6f7fa;
		height: 900rpx;
		border-radius: 40rpx 40rpx 0 0;
		width: 100%;
		position: relative;

		.lable_top {
			text-align: center;
			line-height: 100rpx;
			background-color: #fff;
			border-radius: 40rpx 40rpx 0 0;
			height: 100rpx;

			.icon {
				position: absolute;
				right: 40rpx;
			}
		}

		.sele_ul {
			overflow: auto;
			height: 100%;
			width: 100%;

			.sele_li {
				background-color: #fff;
				margin: 40rpx 30rpx;
				border-radius: 20rpx;
				padding: 24rpx;
				font-size: 28rpx;
				display: flex;
				justify-content: space-between;
				align-items: center;

				&:last-child {
					margin-bottom: 400rpx;
				}

				.sele_li_item {
					display: flex;
					align-items: center;

					.add_ed {
						display: flex;
						flex-direction: column;
						flex: 1;
						margin-left: 14rpx;

						.user_xx {
							font-size: 28rpx;
							display: flex;
							align-items: center;
							margin-bottom: 12rpx;

							.user_name {
								font-size: 28rpx;
							}

							.tip {
								border: 1rpx solid #00c0c0;
								margin-left: 30rpx;
								border-radius: 10rpx;
								padding: 2rpx 6rpx;
								color: #00c0c0;
								font-size: 22rpx;
							}
						}

						.text {
							font-size: 28rpx;
							color: #000;
							width: 100%;
							white-space: pre-wrap;
							margin-top: 12rpx;
						}
					}
				}
			}
		}

		.add_btn {
			position: fixed;
			bottom: 0;
			left: 0;
			right: 0;
			display: flex;
			justify-content: center;
			align-items: center;
			z-index: 3;
			background-color: #fff;
			padding: 30rpx 0;

			.btn {
				margin: 0 80rpx;
				background-color: #007cff;
				color: #fff;
				width: 50%;
				height: 80rpx;
				line-height: 80rpx;
				font-size: 30rpx;
				border-radius: 40rpx;
			}
		}
	}

	.popup-time {
		background-color: #fff;
		height: 600rpx;
		border-radius: 40rpx 40rpx 0 0;
		width: 100%;
		position: relative;
		overflow-y: auto;

		.lable_top {
			text-align: center;
			line-height: 100rpx;
			background-color: #fff;
			border-radius: 40rpx 40rpx 0 0;
			height: 100rpx;
			border-bottom: 1rpx solid #eee;

			.icon {
				position: absolute;
				right: 40rpx;
			}
		}

		.bodyer_time {
			display: flex;
			height: calc(100% - 102rpx);

			.bodyer-left {
				background-color: #eee;

				.left-item {
					padding: 20rpx;
				}

				.active_item {
					background-color: #fff;
					color: #007cff;
				}
			}

			.bodyer-rigth {
				.left-item {
					padding: 20rpx;
					text-align: center;
				}

				.is-show {
					color: #eee;
				}

				.active_item {
					color: #007cff;
				}
			}
		}
	}
</style>
